<template>
  <div>
    <a-table
      :columns="columns"
      :data-source="items"
      size="small"
      :pagination="pagination"
      @change="tableChange"
      :loading="loading"
    >
    </a-table>
  </div>
</template>

<script>
import moment from "moment";

export default {
  name: "FlowPane",
  props: ["items", "loading", "pagination"],
  data() {
    return {
      moment,
      columns: [
        {
            title: '序号',
            dataIndex: 'index',
            key: 'index',
            customRender: (value, item, index) => {
              return item.client_name=='合计'?'':(this.pagination.current-1)*this.pagination.pageSize+index + 1
            },
            width: 45
          },
          {
            title: '开单时间',
            dataIndex: 'create_time',
            key: 'create_time',
            sorter: true,
          },
          {
            title: '客户',
            dataIndex: 'client_name',
            key: 'client_name',
          },
          {
            title: '销售单号',
            dataIndex: 'sales_order_number',
            key: 'sales_order_number',
          },
          {
            title: '品名',
            dataIndex: 'goods_name',
            key: 'goods_name',
          },
          {
            title: '型号尺寸',
            dataIndex: 'specification',
            key: 'specification',
          },
          {
            title: '件数',
            dataIndex: 'quantity',
            key: 'quantity',
          },
          {
            title: '单重',
            dataIndex: 'unit_weight',
            key: 'unit_weight',
          },
          {
            title: '材料重量(市斤)',
            dataIndex: 'total_weight',
            key: 'total_weight',
          },
          {
            title: '材料单价',
            dataIndex: 'material_unit_price',
            key: 'material_unit_price',
          },
          {
            title: '材料金额(元)',
            dataIndex: 'material_amount',
            key: 'material_amount',
          },
          {
            title: '单条数',
            dataIndex: 'unit_strip_count',
            key: 'unit_strip_count',
          },
          {
            title: '总条数',
            dataIndex: 'total_strip_count',
            key: 'total_strip_count',
          },
          {
            title: '烫工单价',
            dataIndex: 'ironing_unit_price',
            key: 'ironing_unit_price',
          },
          {
            title: '烫工金额(元)',
            dataIndex: 'ironing_amount',
            key: 'ironing_amount',
          },
          {
            title: '总金额(元)',
            dataIndex: 'total_amount',
            key: 'total_amount',
          },


          {
            title: '经手人',
            dataIndex: 'handler_name',
            key: 'handler_name',
          },

        ],
    };
  },

  methods: {
    tableChange(pagination, filters, sorter) {
      console.log('sorter:',sorter)
      this.$emit("tableChange", pagination, filters, sorter);
    },

    renderFooter() {
      const totalWeight = this.items.reduce(
        (sum, item) => sum + parseFloat(item.total_weight || 0),
        0
      );
      const totalMaterialAmount = this.items.reduce(
        (sum, item) => sum + parseFloat(item.material_amount || 0),
        0
      );
      const totalIroningAmount = this.items.reduce(
        (sum, item) => sum + parseFloat(item.ironing_amount || 0),
        0
      );
      const totalAmount = this.items.reduce(
        (sum, item) => sum + parseFloat(item.total_amount || 0),
        0
      );

      return (
        <div style="text-align: right; padding-right: 16px; font-weight: bold;">
          材料重量合计: {totalWeight.toFixed(2)} | 材料折后金额合计:{" "}
          {totalMaterialAmount.toFixed(2)} | 烫工金额合计:{" "}
          {totalIroningAmount.toFixed(2)} | 总金额合计: {totalAmount.toFixed(2)}
        </div>
      );
    },
  },
};
</script>
